<template>
  <div class="newTimingTaskContainer">
    <div
      class="dialog animated"
      :class="open? 'fadeIn':'fadeOut'"
      v-show="show"
      :style="{visibility: (visible?'visible':'hidden')}"
    >
      <div class="panel animated" :class="open? 'zoomIn':''">
        <div class="title">
          时间同步
          <div class="close" @click="cancel()"></div>
        </div>
        <div>
          <el-form label-width="200px">
            <el-form-item label="同步时间" :rules="[
      { required: true, message: ''}]">
              <el-row style="width:50%">
                <el-date-picker
                  v-model="timeList"
                  type="datetimerange"
                  align="right"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  :default-time="['12:00:00', '12:00:00']"
                ></el-date-picker>
              </el-row>
            </el-form-item>
          </el-form>
        </div>
        <div class="btn_div">
          <div class="btn_sure" @click="sure()">确 认</div>
          <div class="btn_cancel" @click="cancel()">取 消</div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
var vm;
export default {
  data: function() {
    return {
      show: false,
      open: false,
      visible: false,
      isAdd: true,
      timeList: []
    };
  },
  methods: {
    init: function(data) {
      vm.show = true;
      setTimeout(function() {
        vm.open = true;
        vm.visible = true;
      }, 11);
    },
    sure: function() {
      console.log(vm.timeList);
      if (vm.timeList.length == 0) {
        this.$message.warning("请选择同步开始时间和结束时间");
        return;
      }
      let paras = {
          startTime:vm.timeList[0],
          endTime:vm.timeList[1]
      }
      api.syncByDate(paras).then(function(data) {
          console.log(data);
          if (data.resultCode == 2000) {
            vm.$message({
              message: "同步成功",
              type: "success"
            });
            vm.$emit("callback", "修改成功");
            vm.cancel();
          } else {
            vm.$message.error(data.message);
          }
        });
    },
    cancel: function() {
      //隐藏弹窗
      vm.open = false;
      vm.isAdd = true;
      setTimeout(function() {
        vm.show = false;
        vm.visible = false;
        vm.timeList = [];
      }, 500);
    }
  },
  created: function() {
    vm = this;
  }
};
</script>
<style lang="scss">
.newTimingTaskContainer {
  .el-form-item__label {
    font-size: 0.16rem;
    color: #666666;
  }
  .el-checkbox__label {
    font-size: 0.16rem;
    color: #666666;
  }
}
</style>
<style scoped src="@/style/module/table.css"></style>
<style scoped src="@/style/module/dialog.css"></style>
<style scoped>
.panel {
  padding: 0.2rem;
  width: 8rem;
}
</style>


